'use strict'
import { Text, View } from '../component/index'
import style from './css.css'
const codeReg = new RegExp('`(.*?)`', 'g')
const brReg = new RegExp('---', 'g')
class Descriptor extends React.Component {
  static propTypes = {
    title: PropTypes.string,
    children: PropTypes.string,
    transformCodeMark: PropTypes.bool
  }

  static defaultProps = {
    children: '',
    transformCodeMark: true
  }

  _handleCodeMarkContent () {
    if (this.props.transformCodeMark) {
      return this.props.children.replace(codeReg, function (m, $1) {
        return `<code class="descriptorCode">${$1}</code>`
      }).replace(brReg, '<br/>')
    }
    return this.props.children
  }

  render () {
    return (
      <View className={style.descriptor} >
        <Text className={style.descriptorTitle}>{this.props.title}</Text>
        <div className={style.descriptorContent} dangerouslySetInnerHTML={{ __html: this._handleCodeMarkContent() }}>
        </div>
      </View>
    )
  }
}
export default Descriptor
